<template>
  <div class="app-container">
    <el-tabs v-model="activeName" type="card">
      <el-tab-pane label="基本信息设置" name="first">
        <el-form ref="form" label-width="140px" :model="formData">
          <el-form-item label="是否开启复检：">
            <el-radio-group v-model="formData.recheckable">
              <el-radio :label="1">开启</el-radio>
              <el-radio :label="0">关闭</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="配血查询时间设置：">
            <el-input
              v-model="formData.match_search_time"
              clearable
              placeholder="设置默认拉取时间"
              style="width: 150px"
              type="number"
            >
              <template slot="append">天</template>
            </el-input>
          </el-form-item>
          <el-form-item label="血液失效天数设置：">
            <el-input
              v-model="formData.blood_invalid_days"
              clearable
              placeholder="设置血液失效天数"
              style="width: 150px"
              type="number"
            >
              <template slot="append">天</template>
            </el-input>
            <span class="color-danger ml12">
              在小于所填写天数的时候，血液库存和配血拉取可配血液的列表中会标红显示该袋血
            </span>
          </el-form-item>
          <el-form-item label="常用血袋号长度：">
            <el-input
              v-model="formData.blood_serialno_length"
              clearable
              placeholder="常用血袋号长度"
              style="width: 240px"
              type="number"
            />
          </el-form-item>
          <el-form-item label="最后更新时间：" prop="time">
            <el-date-picker
              v-model="formData.time"
              placeholder="选择日期时间"
              style="width: 240px"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
            />
          </el-form-item>
          <el-form-item label="静默打印预览：">
            <el-radio-group v-model="formData.silent_preview">
              <el-radio :label="1">开启</el-radio>
              <el-radio :label="0">关闭</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSubmit">提交信息</el-button>
          </el-form-item>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="其它信息设置" name="second">其它</el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
  import { getOne, updateOne } from '@/api/systemSet'
  export default {
    name: 'SystemSetting',
    data() {
      return {
        activeName: 'first',
        formData: {
          reckeckable: 0,
          match_search_time: 3,
          time: '2023-05-01',
        },
      }
    },
    created() {
      this.getOne()
    },
    methods: {
      async getOne() {
        const { data } = await getOne(1)
        this.formData = data
      },
      async updateOne() {
        const { msg } = await updateOne(1, this.formData)
        this.$message.success(msg)
        this.$store.commit('initialData/setSystemSet', this.formData)
      },
      onSubmit() {
        this.$refs['form'].validate((valid) => {
          if (valid) {
            this.updateOne()
          } else {
            console.log('error submit!!')
            return false
          }
        })
      },
    },
  }
</script>

<style lang="scss" scoped></style>
